<!-- 题库管理功能介绍 -->
<template>
  <div>
    <div class="left">
      <template>
        <el-input placeholder="输入关键字进行过滤" v-model="filterText">
        </el-input>
        <el-tree
          class="filter-tree"
          :data="data"
          :props="defaultProps"
          :filter-node-method="filterNode"
          ref="tree"
          highlight-current
          check-on-click-node
          @node-click="pickDown"
        >
        </el-tree>
      </template>
    </div>
    <div class="right">
      试卷名称：<el-input
        placeholder="请输入试卷名称"
        v-model="input"
        clearable
        style="width: 300px"
      >
      </el-input
      >&nbsp; 试卷类型：<el-select
        v-model="value1"
        clearable
        placeholder="试卷类型"
        style="width: 130px"
      >
        <el-option
          v-for="item in options1"
          :key="item.id"
          :label="item.name"
          :value="item.name"
        >
        </el-option> </el-select
      >&nbsp; 试卷难度：<el-select
        v-model="value2"
        clearable
        placeholder="试卷难度"
        style="width: 130px"
      >
        <el-option
          v-for="item in options2"
          :key="item.id"
          :label="item.hardLevel"
          :value="item.hardLevel"
        >
        </el-option>
      </el-select>

      <br />
      <br />
      <el-row>
        <el-button type="primary" @click="addQuestionOne()">新增</el-button>
        <el-button type="primary" plain @click="deletes">批量删除</el-button>
        <el-button type="primary" round @click="search">查询</el-button>
        <el-button type="primary" round plain @click="reset">重置</el-button>
      </el-row>
      <br />
      <!-- 表格 -->
      <el-table
        :data="tableData"
        stripe
        style="width: 100%"
        border
        ref="listRef"
        :header-cell-style="{ 'text-align': 'center' }"
      >
        <el-table-column type="selection" width="50" align="center">
        </el-table-column>
        <el-table-column
          label="序号"
          width="60"
          type="index"
          :index="indexMethod"
          align="center"
        >
        </el-table-column>
        <el-table-column prop="name" label="试卷名称"> </el-table-column>
        <el-table-column
          prop="type"
          label="试题类型"
          align="center"
          width="100"
        >
        
        </el-table-column>
        <el-table-column
          prop="difficulty"
          label="难度"
          align="center"
          width="80"
        >
         
        </el-table-column>
        <el-table-column label="操作" align="center" width="130">
          <template slot-scope="scope">
            <el-button @click="handleClick(scope.row)" type="text" size="small"
              >查看</el-button
            >
            <!-- <el-button type="text" size="small" @click="updateOne(scope.row)"
              >修改</el-button
            > -->
            <el-button type="text" size="small" @click="deleteOne(scope.row)"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <!-- 题目详情查看 -->
      
      <Pagination
        v-bind:child-msg="pageparm"
        @callFather="callFather"
      ></Pagination>
    </div>
  </div>
</template>
<style>
.left {
  width: 15%;
  margin: 0 20px;
  display: inline-block;
  /* float: left; */
  vertical-align: text-top;
}
.right {
  vertical-align: text-top;
  display: inline-block;
  /* float: right; */
  width: 75%;
  padding-left: 25px;
  border-left: 1px solid rgb(219, 218, 218);
  /* height: 500px; */
}
</style>
<script>
import dropDown from "../common/dropDown.vue";
import Pagination from "../common/Pagination.vue";
export default {
  data() {
    return {
      //菜单相关
      filterText: "",
      //菜单数据，也是分类的数据
      data: [],
      defaultProps: {
        children: "paperCategors",
        label: "category",
      },
      //搜索题干，题目类型和难度
      input: "",
      options1: [
        {name:'固定试题'},
        {name:'随机试题'},
      ],
      value1: "",
      options2: [
        {hardLevel:'容易'},
        {hardLevel:'一般'},
        {hardLevel:'困难'},
      ],
      value2: "",
      //表格数据
      tableData: [],

      formInline: {
        page: 1,
        limit: 5,
      },
      paper: {
        name: "",
        type: '',
        papercategory: 0,
        difficulty: '',
        fid: 0,
        paperIds: [],
      },
      // 分页参数
      pageparm: {
        currentPage: 1,
        pageSize: 5,
        total: 10,
      },
      
    };
  },
  components: { dropDown, Pagination },
  created() {
    //菜单
    this.findAll();
    //查询所有题目
    this.showAll();
  },
  methods: {
    //批量删除
    deletes() {
      let Ids = [];
      this.$refs.listRef.selection.forEach((e) => {
        Ids.push(e.id);
      });
      this.paper.paperIds = Ids;
      console.log(this.paper.paperIds);
      this.$axios
        .post("/api/PaperListController/delete", this.paper)
        .then((res) => {
          // console.log(res);
          if (res.data.code == 200) {
            this.selectByType();
            this.$message({
              type: "success",
              message: "删除成功",
            });
          } else {
            this.$message({
              type: "info",
              message: "删除失败",
            });
          }
        })
        .catch(() => {});
    },

    //新增试卷
    addQuestionOne() {
    this.$router.push({path: '/addPaper' })
     
    },
    //修改试题
    updateOne(s) {
      // console.log(s);
      // this.$router.push({
      //   name: "addQuestionOne", //路由配置中的name
      //   params: {
      //     type:2,
      //     s,
      //   },
      // });
      alert("修改试卷")
    },

    //删除一个
    deleteOne(data) {
      //console.log(data);
      this.$axios
        .delete("/api/PaperListController/deleteOne/" + data.id)
        .then((res) => {
          // console.log(res);
          if (res.data.code == 200) {
            this.selectByType();
            this.$message({
              type: "success",
              message: "删除成功",
            });
          } else {
            this.$message({
              type: "info",
              message: "删除失败",
            });
          }
        })
        .catch(() => {});
    },
    //查询
    search() {
      // alert("查询")
      this.paper.name = this.input;
      this.paper.type = this.value1;
      this.paper.difficulty = this.value2;
      // console.log(this.paper);
      this.$axios
        .post(
          "/api/PaperListController/findLike/" +
            this.pageparm.currentPage +
            "/" +
            this.pageparm.pageSize,
          this.paper
        )
        .then((res) => {
          // console.log(res);
          this.tableData = res.data.data.list;
          // 分页赋值
          this.pageparm.currentPage = this.formInline.page;
          this.pageparm.pageSize = this.formInline.limit;
          this.pageparm.total = res.data.data.total;
        })
        .catch(() => {});
    },
    //重置
    reset() {
      this.input = "";
      this.value1 = "";
      this.value2 = "";
      this.paper.name = this.input;
      this.paper.type = this.value1;
      this.paper.difficulty = this.value2;
      this.paper.papercategory=0;
      this.paper.fid=0;
      this.findAll();
      this.showAll();
    },
    //展式所有题目
    showAll() {
      this.$axios
        .get(
          "/api/PaperListController/showAll/" +
            this.pageparm.currentPage +
            "/" +
            this.pageparm.pageSize
        )
        .then((res) => {
          // console.log(res);
          this.tableData = res.data.data.list;
          // 分页赋值
          this.pageparm.currentPage = this.formInline.page;
          this.pageparm.pageSize = this.formInline.limit;
          this.pageparm.total = res.data.data.total;
          //   console.log(this.data);
        })
        .catch(() => {});
    },
    //序号处理
    indexMethod(index) {
      return (
        (this.pageparm.currentPage - 1) * this.pageparm.pageSize + index + 1
      );
    },
    // 分页插件事件
    callFather(parm) {
      this.formInline.page = parm.currentPage;
      this.formInline.limit = parm.pageSize;
      this.pageparm.currentPage = this.formInline.page;
      this.pageparm.pageSize = this.formInline.limit;
      // console.log(this.question);
      this.selectByType();
    },
    //判断切换页码时，是什么查询法
    selectByType() {
      if (
      //   this.paper.name = ''
      // this.paper.type = ''
      // this.paper.difficulty = ''
        this.paper.name == "" &&
        this.paper.type == 0 &&
        this.paper.papercategory == 0 &&
        this.paper.difficulty == 0 &&
        this.paper.fid == 0
      ) {
        this.showAll();
      } else {
        this.search();
      }
    },

    //查看详情
    handleClick(data) {
    //  console.log(data);
     this.$router.push({
        name: "selectExamPaperDetails", //路由配置中的name
        params: {
          data
        },
      });
    },
    //菜单
    findAll() {
      //console.log("你好");
      //发送axios拿取菜单
      this.$axios
        .get("/api/PaperListController/findAll")
        .then((res) => {
            // console.log(res);
          //赋值给data
          this.data = res.data.data;
          //   console.log(this.data);
        })
        .catch(() => {});
    },
    filterNode(value, data) {
      if (!value) return true;
      return data.category.indexOf(value) !== -1;
    },
    //菜单节点被选中
    pickDown(data, Node) {
      this.paper.papercategory = 0;
      this.paper.fid = 0;
      // console.log(data);
      if (data.paperCategors.length == 0) {
        // alert("不是父")
        this.paper.papercategory = data.id;
      } else {
        this.paper.fid = data.id;
      }
      // console.log(this.question.titlecategoryId + "..." + this.question.fid);
      //查询一下
      this.search();
    },
  },
  watch: {
    filterText(val) {
      this.$refs.tree.filter(val);
    },
  },
};
</script>